<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<style type="text/css">
<!--
body { background:url(images/Background.jpg) no-repeat center;}
.bloque {
	background:url(images/transp.png);
	height: 420px;
	width: 800px;
	margin: 30px auto;
	border: 1px solid #999;
	padding: 20px;
	position: relative;
	border-radius: 8px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
.hora {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #F00;
	padding: 5px;
	height: 110px;
	width: 200px;
	position: absolute;
	top: 103px;
	right: 55px;
	background-color: #000;
	text-align: center;
	margin: 0px;
	border-radius: 8px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border: 2px solid #FFF;
}
.arrow {
	background-image: url(images/arrow.png);
	background-repeat: no-repeat;
	height: 100px;
	width: 180px;
	top: 250px;
	right: 273px;
	position:absolute;
	padding-top: 78px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
}
.estado {
	padding: 12px;
	border: 3px solid #060;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #090;
	border-radius: 8px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;

}
.numero {
	font-size: 36px;
	font-weight: bold;
}
.formulario {
	height: 400px;
	width: 100%;
}
.datos_left {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px;
	float: left;
	width: 320px;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
}
.datos_right {
	width: 200px;
	float: right;
	padding-top: 215px;
}
h2 {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 20px;
	padding: 0px;
}
.bloque h1 {
	font-family: Verdana, Geneva, sans-serif;
	margin-top: 5px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: 0px;
	text-align: center;
	width: auto;
} 
.datos {
	border:1px solid #666;
	padding:8px;
	font:Verdana, Geneva, sans-serif;
	font-size:24px;
	width:300px;
}
#buscar{
	background:url(images/buscar.png) no-repeat;
	width:60px;
	height:60px;
	border:0px;
	cursor:pointer;
	position:absolute;
	top: 134px;
	left: 380px;
	}
#enviar{
	background:url(images/enviar.png) no-repeat;
	width:310px;
	height:80px;
	border:0px;
	cursor:pointer;
	position:absolute;
	top: 329px;
	left: 33px;
	color:#FFF;
	font:Verdana, Geneva, sans-serif;
	font-size:22px;
	font-weight:bold;
	}
-->
</style>
</head>

<body>
<div class="bloque">
 <form action="index.php" method="post">
  <div class="hora">
    <h2>Hora Actual</h2>
    <div class="numero"><?php echo date ( "h:i:s" , time() )?></div>
  </div>
	<input name="Buscar" type="button" id="buscar"/>
    <input name="Enviar" type="submit" id="enviar" value="Ingresar / Salir" />
    <div class="arrow">
      <div class="estado">- Temprano<br />
        -
      Tarde<br />
      - No ingresa
      </div>
    
    </div>
<h1>Ingreso al Sistema</h1>
  <div class="formulario">
    <div class="datos_left">
      <h2>Ingrese su código </h2>
      <input name="codigo_docente" class="datos" type="text" size="10" maxlength="12" />
      <h2>Horario disponible</h2>
       <input name="codigo_docente" class="datos" type="text" size="10" maxlength="12" disabled="disabled" />
    </div>
    <div class="datos_right"><img src="images/user.png" width="128" height="128" /></div>
  </form>
  </div>
</div>
</body>
</html>